<template>
	<view class="main">
		<view class="banner">
			<image :src="imgUrl + '/statics/js/modules/applet/img/mealListTop.png'" mode=""></image>
		</view>

		<view class="" v-for="(item,index) in demandList" style="	background-color: #F3F4F6; ">
			<view class="">
				<view v-if="item.type == 4">
					<view class="" v-if="item.trackNum == 1">
					<view class=" dingdanhao">
						<view class="">订单号:{{item.orderNum}} {{item.createTime}} </view>
						<view class="peisong">配送</view>
					</view>
					<view style="display: flex;justify-content: space-between; margin: 10px 10px 10px 10px;">
						<view style="width: 50%;">
							<text class="Boxlunch-text">盒饭套餐</text>
							<text>(自提)</text>
						</view>
						<view class="">
							<view class="price">
								<view class="fu">¥</view>
								<view class="grey">{{item.payAmount}}</view>
							</view>
					
						</view>
					</view>
					<view class="" style="display: flex;margin: 10px 10px 10px 10px;">
						<view class="box-lunch">
							<image :src="imgUrl + '/statics/js/modules/applet/img/bento.png'" mode=""></image>
						</view>
						<view class="" style="margin-left: 20px;width: 70%; border-top: 2px solid #DADDE2;">
							<view class="" style="display: flex; justify-content: space-between;">
								<view class="" style="margin-top: 5px;">餐券兑换地址：2展馆展览前台</view>
								<view class="">×{{item.productQuantity}}</view>
							</view>
							<view class="">餐食领取地址：各馆就餐区</view>
							<view class="">手机号：{{item.userPhone }}</view>
							<view class="">配送时间：{{item.mealTime }}</view>
						</view>
					</view>
					<view class="" style="margin: 10px 10px 10px 10px;">
						备注：{{item.remark}}
					</view>
						
					</view>
					<view class="" v-if="item.trackNum == 2">
					<view class=" dingdanhao">
						<view class="">订单号:{{item.orderNum}} {{item.createTime}} </view>
						<view class="peisong">配送</view>
					</view>
					<view style="display: flex;justify-content: space-between; margin: 10px 10px 10px 10px;">
						<view style="width: 50%;">
							<text class="Boxlunch-text">盒饭套餐</text>
							<text>(配送)</text>
						</view>
						<view class="">
							<view class="price">
								<view class="fu">¥</view>
								<view class="grey">{{item.payAmount}}</view>
							</view>

						</view>
					</view>
					<view class="" style="display: flex;margin: 10px 10px 10px 10px;">
						<view class="box-lunch">
							<image :src="imgUrl + '/statics/js/modules/applet/img/bento.png'" mode=""></image>
						</view>
						<view class="" style="margin-left: 20px;width: 70%; border-top: 2px solid #DADDE2;">
							<view class="" style="display: flex; justify-content: space-between;">
								<view class="" style="margin-top: 5px;">展馆：{{item.showroom}}</view>
								<view class="">×{{item.productQuantity}}</view>
							</view>
							<view class="">展位号：{{item.deliveryAddress}}</view>
							<view class="">手机号：{{item.userPhone }}</view>
							<view class="">配送时间：{{item.mealTime }}</view>
						</view>
					</view>
					<view class="" style="margin: 10px 10px 10px 10px;">
						备注：{{item.remark}}
					</view>
				</view>
				</view>
				<view v-if="item.type == 5">
					<view class=" dingdanhao">
						<view class="">订单号:{{item.orderNum}} {{item.createTime}} </view>
						<view class="obligation" v-if="item.status==1">待付款</view>
						<view class="not-redeemed" v-if="item.status==2">未兑换</view>
						<view class="redeemed" v-if="item.status==3">已兑换</view>
					</view>
					<view style="display: flex;justify-content: space-between; margin: 10px 10px 10px 10px;">
						<view style="width: 50%;">
							<text class="buffet">自助餐</text>
						</view>
						<view class="">
							<view class="price">
								<view class="fu">¥</view>
								<view class="grey">{{item.payAmount}}</view>
							</view>

						</view>
					</view>
					<!--  -->
					<view class="" style="display: flex;margin: 10px 10px 10px 10px;">
						<view class="box-lunch">
						<image :src="imgUrl + '/statics/js/modules/applet/img/buffet.png'" mode=""></image>
						</view>
						<view class="" style="margin-left: 20px;width: 70%; border-top: 2px solid #DADDE2;">
							<view class="" style="display: flex; justify-content: space-between;">
								<view class="" style="margin-top: 5px;">餐券兑换地址：北登录厅</view>
								<view class="">×{{item.productQuantity}}</view>
							</view>
							<view class="">餐食领取地址：北登录厅</view>
							<view class="">手机号：{{item.userPhone }}</view>
							<view class="">配送时间：{{item.mealTime }}</view>
						</view>
					</view>
					<view class="" style="margin: 10px 10px 10px 10px;">
						备注：{{item.remark}}
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import indexApi from '@/utils/request/index.js';
	import request from '@/utils/request/index.js';
	import orderApi from '@/api/orderCenter.js';
	export default {
		data() {
			return {
				page: 1,
				limit: 10,
				demandList: [],
				imgUrl: indexApi.baseUrl,
			}
		},
		mounted() {
			this.queryDemandList()
		},
		methods: {
			queryDemandList() {
				orderApi.getOrderingList(this.page, this.limit).then(data => {
					this.demandList = data.data.page.list
					console.log(this.demandList, 999999999);
				});
			},

		}
	};
</script>

<style>
	.main {
		background-color: #F3F4F6;
		height: 100%;
	}

	.banner image {
		width: 100%;
		height: 100px;
	}

	.dingdanhao {
		padding: 10px 10px 10px 10px;
		height: 30px;
		line-height: 30px;
		background-color: white;
		display: flex;
		justify-content: space-between;
	}

	.peisong {
		width: 67rpx;
		height: 29rpx;
		font-family: Microsoft YaHei;
		font-weight: bold;
		font-size: 29rpx;
		color: #00B7B3;
	}

	.price {
		display: flex;
		height: 20px;
		padding-top: 5px;
		width: 40%;
	}

	.fu {
		font-weight: 600;
		margin-top: 12rpx;
		color: red;
		font-size: 28rpx;
	}

	.grey {
		font-weight: normal;
		font-size: 40rpx;
		color: red;
		font-weight: 600;
	}

	.box-lunch image {
		width: 175rpx;
		height: 147rpx;
	}
	.obligation{
		width: 90rpx;
		height: 29rpx;
		font-family: Microsoft YaHei;
		font-weight: bold;
		font-size: 29rpx;
		color: red;
	}
	.not-redeemed{
		width: 90rpx;
		height: 29rpx;
		font-family: Microsoft YaHei;
		font-weight: bold;
		font-size: 29rpx;
		color: red;
	}
	.redeemed{
		width: 90rpx;
		height: 29rpx;
		font-family: Microsoft YaHei;
		font-weight: bold;
		font-size: 29rpx;
		color: #00B7B3;
	}
	.Boxlunch-text{
		width: 116rpx;
		height: 30rpx;
		font-family: Microsoft YaHei;
		font-weight: bold;
		font-size: 29rpx;
		color: #000000;
	}
		
	.buffet{
		width: 116rpx;
		height: 30rpx;
		font-family: Microsoft YaHei;
		font-weight: bold;
		font-size: 29rpx;
		color: #000000;
	}
</style>